import React from 'react'
import { Icon, Button, Checkbox } from 'antd';
import './cms.less'
const CheckboxGroup = Checkbox.Group;
/**
 * props示例：
 * {
    optList: [
      {
        text: '刷新', icon: 'reload', type:'reload'
      },
      {
        text: '新增', icon: 'plus', type:'add'
      }
      ...
    ],
    handles: {
      addHandle: (e) =>{
        console.log('新增')
        dispatch({
          type: 'dict/showModal',
          payload: {
            modalType: 'create',
          },
        })
      },
      delHandle: (e) =>{
        if(delList.length > 0){
          Modal.confirm({
            title: '删除提示',
            content: '确定要删除这些数据吗?',
            onOk() {
              dispatch({
                type: 'dict/delete',
                payload: {
                  ids: delList,
                  tableName: current.tableName,
                  database: current.database,
                },
              });
              dispatch({
                type: 'dict/query',
                payload: {
                  param:{
                    ...param,
                    tableName:current.tableName,
                    database:current.database,
                  },
                  sort:sort,
                  filter: parseFilter(filterParam)
                }
              });
            },
            onCancel() {}
          });
        }else{
          openNotice('warning', '删除提示', '请先在表格中勾选要删除的数据。')
        }
      }
      ...
    }
  }
 */
//表格右上角的按钮组
const ConfirmButton = (props) => {
  const {optList, handles, isModal, checkOptions, checkChange, checkTitle} = props;

  return <div className={isModal? 'uk_table_btns_modal':'uk_table_btns'}>
    {checkTitle ?
      <div className="checkGroupBox">
        <span className="checkGroupS">{checkTitle+"："}</span>
        <span className="checkGroupS">
         <CheckboxGroup options={checkOptions} defaultValue={[]} onChange={checkChange}/>
        </span>
      </div>
      : null}

    {optList.map(function (item, key) {
      if(item.handle === 'link'){
        return <Button type={item.type || "default"} key={key} size={'large'} style={{marginLeft: '20px'}}>
          <a href={item.url}>
            {item.icon ? <Icon type={item.icon}/> : ''}{item.text}
          </a>
        </Button>
      }else{
        return <Button type={item.type || "default"} key={key} onClick={handles[item.handle + 'Handle'] || null}  size={'large'}  style={{marginLeft: '20px'}}>
          {item.icon ? <Icon type={item.icon}/> : ''}{item.text}
        </Button>
      }
    })}
    {props.children}
  </div>
}

export default ConfirmButton
